scrollbar.horizontal>contents{
	min-height: 20px;
	background: linear-gradient(to bottom, transparent 45%, rgba(0,0,0,1) 50%, transparent 55%);
}
scrollbar.vertical>contents{
	min-width: 20px;
	background: linear-gradient(to right, transparent 45%, rgba(0,0,0,1) 50%, transparent 55%);
}
scrollbar>contents>button, scrollbar>contents>button:hover, scrollbar>contents>button:active, scrollbar>contents>button:backdrop, scrollbar>contents>button:disabled, scrollbar>contents>button:backdrop:disabled{
	color: rgba(0,0,0,0);
	border: none;
	border-radius: 0px;
	box-shadow: none;
}
scrollbar.horizontal>contents>button.up{
	background-image: url("../asset/arrow-left.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.up:hover{
	background-image: url("../asset/arrow-left-hover.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.up:active{
	background-image: url("../asset/arrow-left-checked.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.up:backdrop{
	background-image: url("../asset/arrow-left-backdrop.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.up:disabled, scrollbar.horizontal>contents>button.up:backdrop:disabled{
	background-image: url("../asset/arrow-left-disabled.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.down{
	background-image: url("../asset/arrow-right.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.down:hover{
	background-image: url("../asset/arrow-right-hover.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.down:active{
	background-image: url("../asset/arrow-right-checked.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.down:backdrop{
	background-image: url("../asset/arrow-right-backdrop.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>button.down:disabled, scrollbar.horizontal>contents>button.down:backdrop:disabled{
	background-image: url("../asset/arrow-right-disabled.png");
	background-size: 100% 100%;
}
scrollbar.horizontal>contents>trough>slider{
	background: url("../asset/spider-horizontal.png"), url("../asset/scrollbar.png");
}
scrollbar.horizontal>contents>trough>slider:hover{
	background: url("../asset/spider-horizontal-hover.png"), url("../asset/scrollbar-hover.png");
}
scrollbar.horizontal>contents>trough>slider:active{
	background: url("../asset/spider-horizontal-active.png"), url("../asset/scrollbar-active.png");
}
scrollbar.horizontal>contents>trough>slider:backdrop{
	background: url("../asset/spider-horizontal.png"), url("../asset/scrollbar-backdrop.png");
}
scrollbar.horizontal>contents>trough>slider:disabled, scrollbar.horizontal>contents>trough>slider:backdrop:disabled{
	background: url("../asset/spider-horizontal.png"), url("../asset/scrollbar-disabled.png");
}
scrollbar.horizontal>contents>trough>slider, scrollbar.horizontal>contents>trough>slider:hover, scrollbar.horizontal>contents>trough>slider:active, scrollbar.horizontal>contents>trough>slider:backdrop, scrollbar.horizontal>contents>trough>slider:disabled, scrollbar.horizontal>contents>trough>slider:backdrop:disabled{
	background-size: 50% 100%, 85% 50%;
	background-repeat: no-repeat, no-repeat;
	background-position: -25% 0%, 15% 50%;
	min-width: 22px;
}
scrollbar.vertical>contents>button.up{
	background-image: url("../asset/arrow-up.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.up:hover{
	background-image: url("../asset/arrow-up-hover.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.up:active{
	background-image: url("../asset/arrow-up-checked.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.up:backdrop{
	background-image: url("../asset/arrow-up-backdrop.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.up:disabled, scrollbar.vertical>contents>button.up:backdrop:disabled{
	background-image: url("../asset/arrow-up-disabled.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.down{
	background-image: url("../asset/arrow-down.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.down:hover{
	background-image: url("../asset/arrow-down-hover.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.down:active{
	background-image: url("../asset/arrow-down-checked.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.down:backdrop{
	background-image: url("../asset/arrow-down-backdrop.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>button.down:disabled, scrollbar.vertical>contents>button.down:backdrop:disabled{
	background-image: url("../asset/arrow-down-disabled.png");
	background-size: 100% 100%;
}
scrollbar.vertical>contents>trough>slider{
	background: url("../asset/spider.png"), url("../asset/scrollbar-vertical.png");
}
scrollbar.vertical>contents>trough>slider:hover{
	background: url("../asset/spider-hover.png"), url("../asset/scrollbar-vertical-hover.png");
}
scrollbar.vertical>contents>trough>slider:active{
	background: url("../asset/spider-active.png"), url("../asset/scrollbar-vertical-active.png");
}
scrollbar.vertical>contents>trough>slider:backdrop{
	background: url("../asset/spider-hover.png"), url("../asset/scrollbar-vertical-backdrop.png");
}
scrollbar.vertical>contents>trough>slider:disabled, scrollbar.vertical>contents>trough>slider:backdrop:disabled{
	background: url("../asset/spider-hover.png"), url("../asset/scrollbar-vertical-disabled.png");
}
scrollbar.vertical>contents>trough>slider, scrollbar.vertical>contents>trough>slider:hover, scrollbar.vertical>contents>trough>slider:active, scrollbar.vertical>contents>trough>slider:backdrop, scrollbar.vertical>contents>trough>slider:disabled, scrollbar.vertical>contents>trough>slider:backdrop:disabled{
	background-size: 100% 50%, 50% 85%;
	background-repeat: no-repeat, no-repeat;
	background-position: 0% -25%, 50% 15%;
	min-width: 22px;
}